<template>
	<view class="content b-t">
		<view class="list b-b" v-for="(item, index) in shopList" :key="index" @click="select_shop(item)">
			<view class="wrapper">
				<view class="u-box">
					<text class="name">{{ item.name }}</text>
					<text class="mobile">电话:{{ item.tel }}</text>
				</view>
				<view class="address-box">
					<text class="address">地址:{{ item.address }}</text>
				</view>
				
			</view>
			<text class="title" v-if="shop.id === item.id" >取货点</text>
			<text class="title" style='color: #000000;' v-else >切换</text>
		</view>
	</view>
</template>

<script>
import { mapState,mapMutations} from 'vuex';	
export default {
  data() {
    return {
		shopList:[],
	};
  },
  computed: {
  	// ...mapState('shop', ['shop']),
	...mapState('user', ['token'])
  },
  onLoad() {
  	this.loadShops();
  },
  methods: {
	...mapMutations('shop',['setShop']),
	loadShops(){
		return Promise.all([
			this.$ajax.get('home/stores',{}).then(data=>{
				if(0==data.error){
					this.shopList=data.data;
				}
			})
		]).then(e =>{
		})
	},
	select_shop(item){
		if(this.shop && this.shop.id!=item.id){
			this.setShop(item);
			setTimeout(function(){
				return uni.switchTab({
					url:'/pages/index/index'
				})
			},100)
			
		}
		
	},
	
  }
};
</script>

<style lang="scss">
page {
  padding-bottom: 120upx;
}
.content {
  position: relative;
}
.list {
  display: flex;
  align-items: center;
  padding: 30upx 30upx;
  background: #fff;
  position: relative;
}
.wrapper {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.address-box {
  display: flex;
  align-items: center;
  .tag {
    font-size: $font-sm;
    color: $base-color;
    margin-right: 10upx;
    background: #fffafb;
    border: 1px solid #ffb4c7;
    border-radius: 4upx;
    padding: 4upx 10upx;
    line-height: 1;
  }
  .address {
    font-size: $font-base;
    color: $font-color-000;
  }

}
.title{
 font-size: $font-base; 
 color: $font-color-price;
}
.u-box {
  font-size: $font-base;
  color: $font-color-000;
  margin-top: 16upx;
  .name {
    margin-right: 30upx;
  }
}


</style>

